require(['./config'],() =>{
    require(['template','swiper','header','footer','bootstrap','cookie','slideVerify'],(template,Swiper,header) =>{
        class Index {
            constructor () {
                this.box = $('#i-list')
                this.nav = $('#i-nav')
                this.list = $('#i-list .lists')
                this.i = $('#i-nav i')
                this.id = 1;
                this.bindEvents()
                this.shuffling()
                this.rendonIndex()
                this.login()
                this.register()
                this.loginphp()
                this.registerphp()
                this.clearinput()
                this.shuffling()
            }
            bindEvents () {
                var _this = this
                var lastIndex
                this.list.on('click','div',function (){
                    var $str = $(this).find('img').attr('alt')
                    _this.change($str)
                    if($(this).hasClass('one')){
                        _this.id = 1
                        _this.rendonIndex()
                        $('.leaf').css('display','none')
                    }else if($(this).hasClass('two')){
                        _this.id = 3
                        _this.rendonIndex()
                        $('.leaf').css('display','none')
                    }else if($(this).hasClass('three')){
                        _this.id = 5
                        _this.rendonIndex()
                        $('.leaf').css('display','none')
                    }
                })
                $('#goprev').on('click',() =>{
                    if(this.id == 1){
                        alert('已结是第一页')
                    }else{
                        this.id -= 2
                    }
                    this.rendonIndex()
                })
                $('#gonext').on('click',() =>{
                    if(this.id == 5){
                        alert('已经是最后一页了')
                    }else{
                        this.id += 2
                    }
                    this.rendonIndex()
                })
                $('.leaf ul li').on('click',function (){
                    if($(this).data('id') == 1){
                        $(this).addClass('activa')
                        _this.id = 1
                    }else if($(this).data('id') == 2){
                        $(this).addClass('activa')
                        _this.id = 3
                    }else if($(this).data('id') == 3){
                        $(this).addClass('activa')
                        _this.id = 5
                    }
                    _this.rendonIndex()
                })
            }
            change (str) {
                this.box.addClass('list-appear')
                this.nav.removeClass('list-appear')
                this.i.html(str)
            }
            wheel() {
                new Swiper ('.swiper-container', {
                    direction: 'horizontal', // 垂直切换选项
                    loop: true, // 循环模式选项
                    speed : 1000 ,
                    grabCursor : true,
                    autoplay : true,
                    // mousewheel: true,
                    // 如果需要分页器
                    pagination: {
                      el: '.swiper-pagination',
                    },
                    
                    // 如果需要前进后退按钮
                    navigation: {
                      nextEl: '.swiper-button-next',
                      prevEl: '.swiper-button-prev',
                    },
                    
                    // 如果需要滚动条
                    // scrollbar: {
                    //   el: '.swiper-scrollbar',
                    // },
                  })        
            }
            rendonIndex(){
                $.get(`https://mshop.duoyi.com/api/index_product_list?currentPage=${this.id}`,resp => {
                    let {product} = resp.data
                    $('#index-main-one').html(template('indexMainTemplate',{product}))
                    
                })
                $.get(`https://mshop.duoyi.com/api/index_product_list?currentPage=${this.id+1}`,resp =>{
                    let {product} = resp.data
                    $('#index-main-two').html(template('indexMainTemplate',{product}))
                })
            }
            login () {
                $('#minelogin').on('click',() =>{
                    $('#minelogin').addClass('ac')
                    $('#mylogin').removeClass('ac')
                    $('.ewm1').addClass('appear')
                    $('.zhanghao').removeClass('appear')
                })
                $('#mylogin').on('click',() =>{
                    $('#minelogin').removeClass('ac')
                    $('#mylogin').addClass('ac')
                    $('.ewm1').removeClass('appear')
                    $('.zhanghao').addClass('appear')
                })
                $('.lRegister').on('click',() =>{
                    $('#login').modal('hide')
                    $('#register').modal('show')
                })
            }
            register () {
                $('#zc2').on('click',() =>{
                    $('#zc2').addClass('ac')
                    $('#zc1').removeClass('ac')
                    $('.zhanghao1').addClass('appear')
                    $('.two2980').removeClass('appear')
                })
                $('#zc1').on('click',() =>{
                    $('#zc2').removeClass('ac')
                    $('#zc1').addClass('ac')
                    $('.zhanghao1').removeClass('appear')
                    $('.two2980').addClass('appear')
                })
            }
            loginphp () {
                $('.in-login').on('click',() =>{
                    let email = $('.log-email').val(),
                        pwd = $('.log-pwd').val()
                    if(email&&pwd){
                        $.post('http://localhost/project/src/api/user/login.php',resp => {
                            var {list} = resp.body
                            var istrue = list.some(item =>{
                                return item.username == email && item.password == pwd
                            })
                            if(istrue){
                                $.cookie('username',email,{path:'/'})
                                $('.pc').show().html('欢迎您，登录多玩游戏商城')
                                setTimeout(() =>{
                                    $('#login').modal('hide')
                                },2000)
                                header.auto()
                                header.isLogin()
                                header.changeNum()
                            }else{
                                $('.pc').show().html('用户名或者密码错误，请重试')
                            }
                            setTimeout(() =>{
                                $('.pc').hide().html('')
                            },2000)
                        },'json')
                    }else{
                        alert('用户名或者密码不能为空')
                    }    
                })
            }
            registerphp () {
                $('#btn-register1').on('click',() =>{
                        this.email = $('.email').val(),
                        this.pwd = $('.pwd').val(),
                        this.cpwd = $('.cpwd').val()
                        this.tele = 123456
                        if(this.email && this.pwd && this.tele){
                            if( $('.see1').prop('checked')){
                                if(this.pwd === this.cpwd){
                                    $.post('http://localhost/project/src/api/user/register.php',{name:this.email,pwd:this.pwd,tele:this.tele},resp =>{
                                        if(resp.code === 100){
                                            $('.reswarp').show().html(resp.body.msg)
                                        }else if(resp.code === 200){
                                            $('.reswarp').show().html(resp.body.msg)
                                            setTimeout(() =>{
                                                $('#login').modal('show')
                                                $('#register').modal('hide')
                                            },2000)
                                        }else if(resp.code === 0){
                                            $('.reswarp').show().html(resp.body.msg)
                                        }
                                        setTimeout(() =>{
                                            $('.reswarp').hide()
                                        },2000)
                                    },'json')
                                }else{
                                    alert('密码不一致,请重新输入')
                                } 
                            }else{
                                alert('请阅读服务条款，并勾选按钮')
                            }
                        }else{
                            alert('用户名或密码不能为空')
                        }
                })
                $('#btn-register2').on('click',() =>{
                    let tcemail = $('.temail').val(),
                        tcpwd = $('.tpwd').val(),
                        tccpwd = $('.ctpwd').val(),
                        tctele = $('.tete').val()
                    if(tcemail && tcpwd && tccpwd && tctele){
                        if($('.see2').prop('checked')){
                            if(tcpwd === tccpwd){
                                $.post('http://localhost/project/src/api/user/register.php',{name:tcemail,pwd:tcpwd,tele:tctele},resp =>{
                                    if(resp.code === 100){
                                        $('.reswarp').show().html(resp.body.msg)
                                    }else if(resp.code === 200){
                                        $('.reswarp').show().html(resp.body.msg)
                                        setTimeout(() =>{
                                            $('#login').modal('show')
                                            $('#register').modal('hide')
                                        },2000)
                                    }else if(resp.code === 0){
                                        $('.reswarp').show().html(resp.body.msg)
                                    }
                                    setTimeout(() =>{
                                        $('.reswarp').hide()
                                    },2000)
                                },'json')
                            }else{
                                alert('密码不一致,请重新输入')
                            } 
                        }else{
                            alert('请阅读服务条款，并勾选按钮')
                        }
                    }else{
                        alert('用户名或密码不能为空')
                    } 
                })
            }
            clearinput () {
                $('#login').on('hidden.bs.modal', function (e) {
                    $('#mylogin').addClass('ac')
                    $('#minelogin').removeClass('ac')
                    $('.log-email').val('')
                    $('.log-pwd').val('')
                    $('.ewm1').removeClass('appear')
                    $('.zhanghao').addClass('appear')
                })
                $('#register').on('hidden.bs.modal', function (e) {
                    $('.email').val('')
                    $('.pwd').val('')
                    $('.temail').val('')
                    $('.tpwd').val('')
                    $('.ctpwd').val('')
                    $('.tete').val('')
                    $('.zhanghao1').removeClass('appear')
                    $('.two2980').addClass('appear')
                })
            }
            shuffling () {
                $.get('http://localhost/project/src/api/list/shuffling.php',resp =>{
                    var {list} = resp.body
                    if(resp.code ===200){
                        $('.shuffling').html(template('shufflingTemplate',{list}))
                        this.wheel()
                    }
                },'json')
            }
        }
        new Index()
    })
})